<template>
  <el-container class="home-container">
    <Aside></Aside>
    <el-container>
      <el-header>
        <el-button type="info" @click="logout">退出登录</el-button>
        <el-avatar :src="imgUrl"></el-avatar>
      </el-header>
      <div class="content">
        <h1>创建帖子</h1>
        <el-form>
          <el-form-item label="帖子标题">
            <el-input v-model="model.name" style="width: 500px"></el-input>
          </el-form-item>
          <el-form-item label="所属板块">
            <el-select v-model="model.category">
              <el-option
                v-for="item in options"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              ></el-option>
            </el-select>
          </el-form-item>
          <span>帖子内容</span>
          <el-form-item >
            <Editor></Editor>
          </el-form-item>
        
        <el-form-item>
            <el-button type='primary' native-type="submit">保存</el-button>
        </el-form-item>
        </el-form>
      </div>
    </el-container>
  </el-container>
</template>
<script>
// import User from  './user/index'
import Aside from "../components/Aside";
import Editor from "../components/Editor";

export default {
  data() {
    return {
      model: {},
      options: [
        {
          value: "失物招领",
          label: "失物招领",
        },
        {
          value: "校园兼职",
          label: "校园兼职",
        },
      ],
    };
  },
  components: {
    Aside,
    Editor,
  },

  methods: {
    //退出登录，清空sessionStorage
    logout() {
      window.sessionStorage.clear();
      this.$router.push("/login");
    },
  },
};
</script>
<style>
.el-header {
  /* background-color: rgb(32, 28, 28); */
  display: flex;
  justify-content: space-between;
  padding-left: 0;
  align-items: center;
  color: aliceblue;
  font-size: 20px;
  width: 100%;
}
.content{
    padding:10px;
}
</style>